<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <title>Title</title>
    <link rel="stylesheet" href="../static/plugins/layui/css/layui.css">
</head>
<style>
    .ok-body {
        padding: 10px
    }
    .layui-form-item .layui-inline {
        margin-bottom: 5px;
        margin-right: 0px;
    }
    .layui-form-pane .layui-form-label {
        width: 90px;
    }
    .layui-form-item .layui-input-inline {
        width: 170px;
    }
</style>

<body>
<div class="ok-body">

    <div class="layui-row" style="margin-top: 15px">

        <form class="layui-form layui-form-pane">

            <div class="layui-form-item" style="margin-bottom: 5px;">

                <div class="layui-inline">
                    <label class="layui-form-label">设备类型</label>
                    <div class="layui-input-inline" style="margin-right: 0px;">
                        <select name="modelId" lay-search>
                            <option value=""></option>
                        </select>
                    </div>
                </div>


                <div class="layui-inline">
                    <label class="layui-form-label">设备编号</label>
                    <div class="layui-input-inline" style="margin-right: 0px;">
                        <input type="text" name="deviceNumber" class="layui-input" />
                    </div>
                </div>

                <div class="layui-inline">
                    <label class="layui-form-label">故障现象</label>
                    <div class="layui-input-inline" style="margin-right: 0px;">
                        <input type="text" name="symptom" class="layui-input" />
                    </div>
                </div>

                <div class="layui-inline">
                    <label class="layui-form-label">关键词</label>
                    <div class="layui-input-inline" style="margin-right: 0px;">
                        <select name="keyWordId" id="keyWordId" lay-filter="keyWordSearch" lay-search>
                            <option value=""></option>
                        </select>
                    </div>
                </div>

            </div>

            <div class="layui-form-item">

                <div class="layui-inline">
                    <label class="layui-form-label">生产线</label>
                    <div class="layui-input-inline" style="margin-right: 0px;">
                        <select name="productionLine" lay-search>
                            <option value=""></option>
                        </select>
                    </div>
                </div>

                <div class="layui-inline">
                    <label class="layui-form-label">发生时间</label>
                    <div class="layui-input-inline" style="margin-right: 0px;">
                        <input class="layui-input" name="faultTime" id="faultTime" autocomplete="off">
                    </div>
                </div>

                <div class="layui-inline">
                    <label class="layui-form-label">停机时长</label>
                    <div class="layui-input-inline" style="margin-right: 0px;">
                        <input type="text" name="stopDuration" maxlength="10" class="layui-input" />
                    </div>
                </div>

                <div class="layui-inline">
                    <button class="layui-btn  layui-btn-normal" style="margin-left: 10px" lay-submit lay-filter="search">搜索
                    </button>

                    <span>
                        <button type="button" class="layui-btn layui-btn-warm" id="add" style="float: right;margin-left: 5px;">新增</button>
                        <button type="button" class="layui-btn layui-btn-danger" id="delete" style="float: right;margin-left: 60px;">删除</button>
                    </span>
                </div>

            </div>
        </form>

    </div>

    <hr class="layui-bg-orange">

    <table class="layui-hide" id="faultInfo" lay-filter="faultInfo"></table>
    <!--分页Div-->
    <div id="pageDiv"></div>

</div>

<script src="../static/plugins/layui/layui.js"></script>
<script src="../static/js/jquery-3.2.1.min.js"></script>
<script src="../static/js/jquery.base64.js"></script>
<script src="../static/js/device.js"></script>

<script th:inline="none">
    layui.use(['table', 'laypage', 'form','laydate'], function () {
        var table = layui.table;
        var form = layui.form;
        var laydate = layui.laydate;


        JJZ.initSelect(JJZ.named('modelId'), '/model/dataGrid', function (noError) {
            form.render();
        });

        JJZ.initSelect(JJZ.named('productionLine'), '/productionLine/dataGrid', function (noError) {
            form.render();
        });

        JJZ.initSelect(JJZ.named('keyWordId'), '/keyWord/dataGrid', function (noError) {
            form.render(); //更新表单
        });
        //设备安装年月
        laydate.render({
            elem: '#faultTime'
            ,format: 'yyyy-MM-dd'
        });

        var tableName = 'faultInfo';
        var tableRenderObject = {
            elem: '#' + tableName
            , title: '设备数据表'
            , tableName: tableName
            , searchCol: ''
            , searchValue: ''
            // , height: 'full-200'
            ,defaultToolbar: ['filter', 'print']
            ,toolbar: true
            , cols: [[
                {type: 'checkbox', fixed: 'left'}
                , {field: 'deviceNumber', title: '设备编号', align: 'center',width: 87}
                , {field: 'deviceName', title: '设备名称', align: 'center',width:116}
                , {field: 'lineName', title: '所在生产线', align: 'center', width: 100}
                , {field: 'symptom', title: '现象', align: 'center', width: 100}
                , {field: 'partName', title: '部位', align: 'center', width: 100, templet: function (d) {
                        if (d.faultContent) {
                            var devicePart = JSON.parse(d.faultContent);
                            var parts = [];
                            if(devicePart.length>0){
                                for (var index in devicePart) {
                                    parts.push(devicePart[index].faultPartName);
                                }
                            }
                            if(parts.length>0){
                                return parts.join('、');
                            }else{
                                return '无';
                            }
                        } else {
                            return '无';
                        }
                    }
                }
                , {field: 'resolvent', title: '排除过程', align: 'center', minWidth: 88}
                , {title: '故障时间', align: 'center', width: 104, templet: function (d) {
                        return JJZ.FormatDate(d.faultTime, 'yyyy-MM-dd');
                    }
                }
                , {field: 'duration', title: '故障时长', align: 'center',width: 87}
                , {field: 'masterSolverName', title: '主维修', align: 'center', width: 73}
                , {field: 'solveName', title: '辅助维修', align: 'center', width: 100}
                , {title: '配件更换', align: 'center', minWidth: 95, templet: function (d) {
                        if (d.faultContent) {
                            var devicePart = JSON.parse(d.faultContent);
                            var components = [];
                            for (var index in devicePart) {
                                var changeComponents = devicePart[index].changeComponent;
                                if(changeComponents.length>0){
                                    for(var j in changeComponents){
                                        components.push(changeComponents[j].componentName);
                                    }
                                }
                            }
                            if(components.length>0){
                                return components.join('、');
                            }else{
                                return '无';
                            }
                        } else {
                            return '无';
                        }
                    }
                }
                , {fixed: 'right', align: 'center', title: '操作',width:130, templet: function (d) {
                        var detailUrl = 'javascript:JJZ.getRequestToPage("' + '/faultInfo/faultInfoDetail?id=' + d.id + '")';
                        //'<a href="javascript:JJZ.editPage(\'' + tableName + '\',' + d.id + ')" class="layui-table-link">编辑</a>&nbsp;&nbsp;' +
                        return'<a href=' + detailUrl + ' class="layui-table-link">详情</a>&nbsp;&nbsp;' +
                            '<a href="javascript:addAcceptNum(' + d.id + ')" class="layui-table-link">采纳</a>';
                    }
                }
            ]]
        };

        var myTable = new JJZ.MyTable(tableRenderObject);


        form.on('submit(search)', function (data) {
            if(data.field.stopDuration && data.field.stopDuration!=''){
                var pattern = /^[1-9]\d*$/g;
                if( pattern.test(data.field.stopDuration) === false){
                    layer.msg('停机时长必须为正整数!!!');
                    return false;
                }
            }
            var encodeStr = $.base64.encode(JSON.stringify(data.field), 'utf-8');
            var param = 'json=' + encodeURIComponent(encodeStr);
            tableRenderObject.initParam = param;
            myTable.render();
            return false;
        });

        //新增，跳转至页面
        $('#add').click(function () {
            myTable.add();
        });

        //批量删除数据
        $('#delete').click(function () {
            var checkStatus = table.checkStatus('faultInfo') //idTest 即为基础参数 id 对应的值
                , data = checkStatus.data; //获取选中的数据
            layer.confirm('确认删除？', function (index) {
                myTable.delete(data);
                myTable.render();
                layer.close(index);
            });
        });
    });

    function addAcceptNum(id) {
        JJZ.requestData('/faultInfo/addAcceptNum', 'id=' + id, function (data) {
            layer.msg('采纳成功', {
                icon: 1,
                time: 2000
            });
        })
    }
</script>

</body>
</html>